<template>

  <UserCardList :user-list="userList"></UserCardList>

  <van-empty v-if="!userList || userList.length===0" image="search" description="暂无搜索结果用户" />
</template>

<script setup>

import {useRoute} from "vue-router";
import {onMounted, ref} from "vue";
import MyAxios from "../plugin/myAxios.ts";
import qs from "qs"
import UserCardList from "../components/UserCardList.vue";

const route = useRoute()

// 获取到数组
const {tags} = route.query;
console.log(tags);

const userList = ref([]);

const mockUser =
    {
      id: 1,
      userName: "yefan",
      userAccount: "yefan666",
      avatarUrl: "https://gw.alipayobjects.com/zos/antfincdn/XAosXuNZyF/BiazfanxmamNRoxxVxka.png",
      gender: 1,
      phone: "12321321",
      email: "21312@qq.com",
      userStatus: 1,
      userRole: 0,
      createTime: new Date(),
      profile: "个人简介，还没秃头！",
      tags: ["Java", "Python", "C++", "机器学习", "数据挖掘", "男", "emo", "打工种", "社畜"]
    }

onMounted(async ()=>{
  const userListData = await MyAxios.get(
    '/user/list/tags', {
    params: {
      tagNameList: tags
    },
    paramsSerializer:{
      serialize: params => {
        return qs.stringify(params, {indices: false})
      }
    }

  })
  .then(function (resp) {
    console.log("/user/list/tags succeed: ", resp)
    return resp;
  })
  .catch((e)=>{
    console.error("/user/list/tags error: ",e)
  });
  if (userListData) {
    console.log("+++++", userListData)
    //console.log(JSON.parse(userListData.data.tags));

    userListData.data.forEach(item => {
      console.log(JSON.parse(item.tags))
      if (item.tags) {
        item.tags = JSON.parse(item.tags);
      }
    })
    userList.value = userListData.data;
  }
})


</script>

<style scoped>

</style>